<template>
  <div class="DamageRegistration">
    <!-- 筛选 -->
    <DamageRegistrationScreen @changeParams="changeParams" />
    <!-- 上拉加载 -->
    <van-list
      v-model="loading"
      :finished="finished"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <div v-if="list.length > 0">
        <DamageRegistrationItem
          v-for="(item, index) in list"
          :key="index"
          :data="item"
          @getDamageDetails="getDamageDetails"
          @changeDamageDetailsEdit="changeDamageDetailsEdit"
        />
      </div>
      <van-empty v-else />
    </van-list>
    <!-- 破损详情 -->
    <DamageDetails ref="DamageDetails" />
    <!-- 破损编辑 -->
    <DamageDetailsEdit
      type1="1"
      @refreshData="refreshData"
      ref="DamageDetailsEdit"
    />
  </div>
</template>

<script>
import Vue from "vue";
import { List, Empty,Toast } from "vant";
import { getDamageList } from "./../services/api";
import DamageRegistrationScreen from "@/components/DamageRegistrationScreen.vue";
import DamageRegistrationItem from "@/components/DamageRegistrationItem.vue";
import DamageDetails from "@/components/DamageDetails.vue";
import DamageDetailsEdit from "@/components/DamageDetailsEdit.vue";

Vue.use(Empty);
Vue.use(List);
export default {
  data() {
    return {
      params: {
        masterWaybillId: "",
        subWaybillId: "",
        operator: "",
        makeTimeStart: "",
        makeTimeEnd: "",
        pageNum: 1,
        pageSize: 20,
      },
      list: [],
      loading: false,
      finished: false,
    };
  },
  mounted() {
    // 发货完成原生回调
    window["customClick"] = () => {
      this.showRegistration();
    };
    // 设置按钮
    setTimeout(() => {
      try {
        window.appPlat.setRightTitle("破损登记");
      } catch (e) {
        Toast("设置未成功");
      }
    }, 200);
  },
  methods: {
    // 加载数据
    onLoad() {
      getDamageList(this.params).then((res) => {
        if (res) {
          this.loading = false;
          if (this.params.pageNum == 1) {
            this.list = res.list;
          } else {
            this.list = this.list.concat(res.list);
          }
          this.params.pageNum += 1;
        }
        if (res.list.length < 20) {
          this.finished = true;
        }
      });
    },
    // 子组件传值赛选
    changeParams(e) {
      this.params = { ...e, pageNum: 1, pageSize: 20 };
      this.finished = false;
    },
    // 子组件传值编辑
    changeDamageDetailsEdit(e) {
      this.$refs.DamageDetailsEdit.getDamageInfo(e);
    },
    // 自助间传值获取详情
    getDamageDetails(e) {
      this.$refs.DamageDetails.getDamageInfo(e);
    },
    // 子组件编辑刷新
    refreshData() {
      this.list = [];
      this.params.pageNum = 1;
      this.finished = false;
    },
    // 开启破损登记
    showRegistration() {
      this.$refs.DamageDetailsEdit.show = true;
    },
  },
  components: {
    DamageRegistrationScreen,
    DamageRegistrationItem,
    DamageDetails,
    DamageDetailsEdit,
  },
};
</script>

<style lang="scss" scoped>
</style>